<script setup lang="ts">
import { ref, watch, computed } from 'vue'
import { roleStore } from '@/stores/role'
import { headersStore } from '@/stores/apiHeader'
import { baseToolsStore } from '@/stores/baseTools'
//全球入职分析
import GlobalEntryAnalysis from '@/components/PermissionsModule/Human/GlobalEntryAnalysis.vue'
// 全球离职分析
import GlobalDepartureAnalysis from '@/components/PermissionsModule/Human/GlobalDepartureAnalysis.vue'
// 全球入职人数比对
import GlobalEnterComparison from '@/components/PermissionsModule/Human/GlobalEnterComparison.vue'
// 全球离职职人数比对
import DepartureComparison from '@/components/PermissionsModule/Human/DepartureComparison.vue'
// 人员流动率
import EmployeeTurnoverRate from '@/components/PermissionsModule/Human/EmployeeTurnoverRate.vue'
//集团只能离职人数
import InformationTechnologyDepartmentStaffCount from '@/components/PermissionsModule/Human/InformationTechnologyDepartmentStaffCount.vue'
//集团只能入职人数
import InfoTechDeptResignationNums from '@/components/PermissionsModule/Human/InfoTechDeptResignationNums.vue'

const store = roleStore() as any
const isDepartment = computed(() => baseToolsStore().isDepartment) //是否是部门
const { humanLevel } = store
// 1 全球 2 区域 3 国家
const newRole = ref(0)
newRole.value = humanLevel // 初始化面板权限
// 深度监听 store.panelPermissions
watch(
  () => store.humanLevel,
  (newVal) => {
    newRole.value = newVal
  }
)
//获取当前月份
const month = computed(() => {
  return headersStore().month
})
// 是否为集团总部
const isHeadquarters = computed(() => {
  return headersStore().scope_code === '0000100001'
})
const props = defineProps({
  showRemainingComponents: {
    type: Boolean,
    default: false,
  },
})
</script>

<template>
  <GlobalEntryAnalysis v-if="newRole !== 0 && month === '00'" />
  <GlobalDepartureAnalysis v-if="newRole !== 0 && month === '00'" />
  <GlobalEnterComparison
    v-if="newRole !== 0 && month !== '00' && !isHeadquarters && !isDepartment"
  />
  <DepartureComparison
    v-if="newRole !== 0 && month !== '00' && !isHeadquarters && !isDepartment"
  />

  <InfoTechDeptResignationNums
    v-if="(isHeadquarters || isDepartment) && month !== '00' && newRole === 2"
  />
  <InformationTechnologyDepartmentStaffCount
    v-if="(isHeadquarters || isDepartment) && month !== '00' && newRole === 2"
  />
  <EmployeeTurnoverRate v-if="isHeadquarters && month === '00'" />
  <div v-if="showRemainingComponents">
    <EmployeeTurnoverRate
      v-if="(newRole !== 0 || isDepartment) && month === '00'"
    />
    <EmployeeTurnoverRate
      v-if="(newRole !== 0 || isDepartment) && month === '00' && isHeadquarters"
    />
    <GlobalEntryAnalysis v-if="isDepartment && month !== '00'" />
    <GlobalDepartureAnalysis v-if="isDepartment && month !== '00'" />
    <EmployeeTurnoverRate v-if="isDepartment && month !== '00'" />
  </div>
</template>
<style lang="scss" scoped></style>
